<template>
  <div>
    <hello-world :msg="msg"></hello-world>
    <Button @click="clickhandler"></Button>
    <hr />
    <Card>
      <template #header>this is header! </template>
      <template #footer>this is footer! </template>
    </Card>
    <Collapsible></Collapsible>
  </div>
</template>

<script>
import helloWorld from "./HelloWorld";
import Button from "./button.vue";
import Card from "./components/Card.vue";
import Collapsible from "./components/Collapsible.vue";
export default {
  data() {
    return {
      msg: "xiao xiao",
    };
  },
  methods: {
    clickhandler() {
      console.log("----- 触发-----");
    },
  },
  components: {
    helloWorld,
    Button,
    Card,
    Collapsible
  },
};
</script>

<style lang="sass"></style>
